<template>
  <div>
    <van-nav-bar
        :title="title"
        :left-text="leftText"
        :left-arrow="leftArrow"
        @click-left="leftTextClick"
    />
    <van-search
        v-model="keyword"
        shape="round"
        background="#42bd56"
        placeholder="请输入搜索关键词"
        @focus="onFoucs"
    />
  </div>
</template>
<script>
import {ref} from 'vue'
import {useRouter} from 'vue-router'

export default {
  props: {
    title: {
      type: String
    },
    leftText: {
      type: String
    },
    leftArrow: {
      type: Boolean,
      default: true
    }
  },
  components: {
  },
  //可以有入参
  setup(props, context) {
    const router = useRouter()
    const keyword = ref('')

    //函数里面可在定义函数。。。
    function leftTextClick() {
      context.emit("onLeftTextClick")
    }
	
    function onFoucs() {
      router.push('/search')
    }

    return {
      keyword,
      leftTextClick,
      onFoucs
    }
  }
}
</script>
<style  scoped>

</style>
